import {Button, message, Upload} from 'antd'
import React, {useEffect, useState} from 'react'
import {useModel} from 'umi'
import styles from './index.less'
import {uploadFileUrl} from '@/service/common/upload'

const {Dragger} = Upload

type PropsType = {
	text?: string
	modelName: string
	targetAttr: number
	callback: {(key: string): void; (arg0: any): void}
	all?: boolean
	uploadType?: 'DDUpload' | 'devUpload'
	type?:
		| 'text'
		| 'link'
		| 'ghost'
		| 'default'
		| 'primary'
		| 'dashed'
		| undefined
	fileList?: {uid: string; name: string; url: string}[]
	isImage?: boolean
	fileFormat?: string // 上传附件格式
	attachmentSize?: number // 上传附件大小限制
}
const customUpload = (props: PropsType) => {
	const {
		text = '请上传文件',
		modelName,
		targetAttr,
		callback,
		all = false,
		type = 'link',
		fileList,
		isImage = true,
		fileFormat,
		attachmentSize = 20,
	} = props
	const {initialState} = useModel('@@initialState')
	const {fileName} = initialState || {}
	const [status, setStatus] = useState<boolean>(false)
	const [uploadProps, setUploadProps] = useState<any>({})
	const [newFileList, setNewFileList] = useState(fileList)
	const [edit, setEdit] = useState(false)

	useEffect(() => {
		if (!edit) {
			if (fileList?.[0]?.name) {
				setStatus(true)
				setNewFileList(fileList)
			} else {
				setNewFileList([])
			}
		}
	}, [fileList, edit])

	const onIsImage = (value: any) => {
		if (isImage) {
			return false
		}
		const lastStr = value?.name?.split('.')
		const format = lastStr?.[lastStr.length - 1]
		const str = 'jpg,png,jpeg,gif'
		const isImg = str?.includes(format)
		return isImg
	}
	const onImage = (value: any) => {
		if (fileFormat) {
			const lastStr = value?.name?.split('.')
			const format = lastStr?.[lastStr.length - 1]
			const isImg = fileFormat?.includes(format)
			return !isImg
		}
		return false
	}

	useEffect(() => {
		const newUploadProps = {
			action: uploadFileUrl,
			name: fileName,
			data: {
				modelName,
				targetAttr,
			},
			fileList: newFileList,
			beforeUpload: (file: any) => {
				const isImg = onIsImage(file)
				if (isImg) {
					message.warning('不能上传图片格式的附件')
				}
				if (onImage(file)) {
					message.warning('请上传jpg,png格式的文件')
				}
				const sizeLimit = file.size / 1024 / 1024 < attachmentSize
				let messages
				if (attachmentSize < 1) {
					messages = `文件必须小于${attachmentSize * 1000}KB`
				} else {
					messages = `文件必须小于${attachmentSize}MB`
				}
				if (!sizeLimit) {
					message.warning(messages)
				}
				return sizeLimit && !isImg && !onImage(file)
			},
			onChange(info: any) {
				if (!onIsImage(info?.file) && info?.file?.status) {
					setNewFileList(info?.fileList)
				}
				if (info.file.status === 'uploading') {
					setStatus(true)
				}
				if (info.file.status === 'done') {
					message.success('上传成功')
					const imgData = info.fileList[0].response.data
					callback(all ? imgData : imgData?.id)
					setNewFileList([
						{
							name: info.fileList[0]?.name,
							uid: imgData?.id,
							url: imgData?.url,
						},
					])
					setStatus(true)
				} else if (info.file.status === 'removed') {
					callback('')
					setStatus(false)
				} else if (info.file.status === 'error') {
					setNewFileList([])
					message.error(info?.file?.response.msg)
				}

				if (info.fileList?.length === 0) {
					setStatus(false)
					setNewFileList([])
				}
				setEdit(true)
			},
		}
		setUploadProps(newUploadProps)
	}, [newFileList])
	return (
		<div className={styles.newUpload}>
			<Dragger {...uploadProps}>
				{status ? (
					''
				) : (
					<>
						<Button type={type} ghost shape="round" size="small">
							{text}
						</Button>
					</>
				)}
			</Dragger>
		</div>
	)
}

export default customUpload
